<template>
  <div class="bg_write" v-loading="loading">
    <tableComponents
      :pagination="{currentPage,pageSize,total:list.all_num}"
      @handleCurrentChange="handleCurrentChange"
      @handleSizeChange="handleSizeChange"
      @sendUserSearch="receive_search"
      :isHaveExport="false"
      :isHaveAdd="false"
      :searchData="logSearchData"
    >
      <template v-slot:table>
        <el-table
          ref="multipleTable"
          :data="list.data"
          header-row-class-name="head_color"
          v-loading="loading"
          stripe
          tooltip-effect="dark"
          style="width: 99.9%"
        >
          <el-table-column label="管理员" min-width="100">
            <template slot-scope="scope">{{ scope.row.username }}</template>
          </el-table-column>

          <el-table-column label="操作记录" min-width="200">
            <template slot-scope="scope">{{ scope.row.log_info }}</template>
          </el-table-column>

          <el-table-column label="登录IP" min-width="150">
            <template slot-scope="scope">{{ scope.row.log_ip }}</template>
          </el-table-column>

          <el-table-column label="请求url" min-width="200">
            <template slot-scope="scope">{{ scope.row.log_url }}</template>
          </el-table-column>

          <el-table-column label="操作ID" min-width="100">
            <template slot-scope="scope">{{ scope.row.info_id }}</template>
          </el-table-column>

          <el-table-column label="操作时间" min-width="150">
            <template slot-scope="scope">{{ scope.row.created_time | getTimeFormat }}</template>
          </el-table-column>
        </el-table>
      </template>
    </tableComponents>
  </div>
</template>
<script>
import { logSearchData } from "../../assets/js/searchData/searchData"; //引入搜索的数据
export default {
  data() {
    return {
      search_form: {
        username: "", //管理员
        log_info: "", //操作记录
        log_ip: "", //ip
        log_url: "", //请求url
        info_id: "", //操作id
        created_time_begin: "", //时间区间
        created_time_end: ""
      },
      loading: false,
      list: [],
      allPage: 0,
      allNum: 0,
      pageSize: 10,
      currentPage: 1,
      logSearchData: logSearchData
    };
  },
  methods: {
    receive_search(val) {
      this.search_form = val;
      this.getNewsAll(1, this.pageSize);
    },
    getNewsAll(page, page_size) {
      this.loading = true;
      page = page || 1;
      page_size = page_size || 10;
      let data = {};
      data = this.search_form;
      data.cate_id = "";
      data.page = page;
      data.page_size = page_size;

      this.$api.getAdminuser.adminLog(data).then(res => {
        if (res.data.code == 200) {
          this.list = res.data.result;
        }
      });
      this.loading = false;
    },
    handleSizeChange(val) {
      this.getNewsAll("", val);
      this.pageSize = val;
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.$router.push(this.$route.path + "?page=" + val);
    }
  },
  beforeCreate() {
    this.loading = true; //数据未加载之前调用loading
  },
  created() {
    this.getNewsAll();
    this.loading = false;
  },
  computed: {},
  watch: {
    getAdminuserList(obj) {
      this.list = obj.data;
      this.pageSize = parseInt(obj.page_size);
      this.currentPage = parseInt(obj.page);
      this.allPage = obj.all_page;
      this.allNum = obj.all_num;
    },
    $route() {
      var page = this.$route.query.page || 1;
      var page_size = this.pageSize;
      this.getNewsAll(page, page_size);
      this.currentPage = Number(this.$route.query.page) || 1;
    }
  }
};
</script>
